<template>
  <div class="container">
    <div class="mask"
         v-if="ticket_mark">
      <div class="ticketBox">
        <p class="tb-title">
          可用优惠券
          <span class="close"
                @click="closeTicketBox">×</span>
        </p>
        <scroll-view :scroll-y="true"
                     :style="{'height': '474px'}"
                     @scroll="scroll"
                     @scrolltolower="pullrefresh">
          <div class="tb-ticket"
               @tap="checkTicket(item)"
               v-for="(item, index) in ticket_array"
               :key="index">
            <div class="tb-left">
              <!-- 满减券 -->
              <div class="center"
                   v-if="item.source!=3">
                <div class="money">
                  <div class="icon">￥</div>
                  <div class="num">{{item.type_money}}</div>
                </div>
                <div class="tip">满{{item.type_money}}可用</div>
              </div>
              <!-- 特殊券 -->
              <div class="center special"
                   v-if="item.source==3">体验券</div>
            </div>
            <div class="tb-right">
              <div class="t-title clearfix">
                <div class="t-type">[{{item.source_name}}]</div>
                <div class="t-name">{{item.type_name}}</div>
              </div>
              <div class="dec">可在{{item.condtion_name}}使用</div>
              <div class="t-timer">{{item.start}}~{{item.end}}</div>
            </div>
            <div class="user-btn">
              <img :src="ImgBaseUrl+'/mp_3.0/mine/coupon_empty@2x.png'"
                   v-if="ImgBaseUrl&&item.is_use == 1"
                   alt
                   class="img" />
              <img :src="ImgBaseUrl+'/mp_3.0/mine/coupon_selected@2x.png'"
                   v-if="ImgBaseUrl&&item.is_use == 2"
                   alt
                   class="img" />
            </div>
          </div>
          <!-- <div class="list"
               v-for="(item,index) in ticket_array"
               :key="index"
               @click="checkTicket(item)">
            <div class="list_left"
                 v-if="item.dedicated_status == 0">
              ¥
              <span class="amount">{{item.type_money}}</span>
              <p class="amount1">{{item.type_name}}</p>
            </div>
            <div class="list_left"
                 v-if="item.dedicated_status == 1">
              <span class="book-ticket">
                预约
                <br />专用券
              </span>
            </div>
            <div class="list_mid">
              <p class="text1">
                <span class="cash_ticket">现金券</span>
                {{item.source}}
              </p>
              <p class="text2">
                可在
                <span class="red"
                      v-html="item.condtion == 1 ? '品质医美':'积分商城'"></span>
                中使用
              </p>
              <p class="text3">{{item.start_ticket_time}}~{{item.end_ticket_time}}</p>
            </div>
            <div class="list_right">
              <span class="text1"
                    v-if="item.is_use == 1">立即使用</span>
              <img src="https://h5.ameimeika.com/mp_images/mp_2.0/pinzhiyimei/Group 11@2x.png"
                   class="icon"
                   v-if="item.is_use == 2" />
            </div>
          </div>-->

        </scroll-view>
      </div>
    </div>
    <scroll-view :scroll-y="true"
                 :style="{'height': '93%'}"
                 @scroll="scrollmain"
                 @scrolltolower="pullrefresh">
      <div class="mall">
        <div class="mall_left">
          <img :src="'https://img.ameimeika.com/'+mall.image"
               alt
               class="mallIMG" />
        </div>
        <div class="mall_right">
          <p class="mall_name">{{mall.name}}</p>
          <p class="hos_name">{{mall.hospitals_name}}</p>
          <div class="plusbox"
               v-if="mall.plus_title">{{mall.plus_title}}</div>
          <p class="booking_price"
             v-if="mall.activity_status==3">
            预约价
            <span class="price">¥{{mall.appointment_price}}</span>
          </p>
          <p class="booking_price"
             v-if="mall.activity_status == 2">
            <span class="item">¥</span>
            <span class="price">{{mall.appointment_price}}</span>
          </p>
          <p class="booking_price"
             v-if="mall.activity_status==4">
            <span class="item">¥</span>
            <span class="price">{{mall.project_price}}</span>
            <span class="text1"
                  v-if="deduction_credit > 0">积分可抵¥{{deduction_credit}}</span>
          </p>
        </div>
      </div>
      <doctorList :doctorList="doctorList"
                  ref="mychild"
                  @click="doctorDetail"
                  v-if="doctorList.length > 0"></doctorList>
      <div class="main">
        <view class="section"
              v-if="mall.activity_status !== 2 && mall.activity_status !== 4">
          <view class="section__title"></view>
          <picker mode="date"
                  :value="date"
                  :start="currentdate"
                  :end="end_time"
                  @change="bindDateChange">
            <view class="picker">
              预约时间: &nbsp; &nbsp;
              <span class="style?'date_unde':'date_value'">{{date}}</span>
              <img src="https://h5.ameimeika.com/mp_images/jifenshangcheng/xiangqingye/xiayibu@2x.png"
                   alt
                   class="right" />
            </view>
          </picker>
        </view>
        <div class="text">
          微信号: &nbsp; &nbsp;
          <input type="text"
                 placeholder="请输入（选填）"
                 class="tel_input"
                 v-model="wetchartNum"
                 @input="clearEmoji" />
        </div>
        <div class="text text1">
          推荐人手机号: &nbsp; &nbsp;
          <input type="number"
                 placeholder="请输入推荐人手机号（选填）"
                 class="tel_input"
                 :disabled="isPhone"
                 v-model="telNum"
                 @blur="focusInput"
                 maxlength="11" />
        </div>
      </div>
      <div class="text4 user-point"
           v-if="activity_status == 4 && deduction_credit >0">
        账户可消费积分：
        <span class="item">{{mall.user_credit}}</span>
      </div>
      <div class="text text5"
           v-if="activity_status == 4 && deduction_credit > 0">
        <!-- 本次使用{{kou_credit}}积分抵扣<span class="red">¥</span><span class="red">{{kou_credit}}</span> -->
        可使用积分抵扣
        <div class="chhoose_use_sel">
          <span @click="creadite_fix(0)"
                class="num_less">-</span>
          <input class="num_self"
                 @input="credite_input()"
                 v-model="kou_credit"
                 type="number" />
          <span @click="creadite_fix(1)"
                class="num_add">+</span>
        </div>
      </div>
      <div class="text2"
           v-if="activity_status == 4 && deduction_credit > 0">
        <p class="row">
          <span class="row_item">抵扣后金额</span>
          <span class="row_item1">¥</span>
          {{dikou_point}}
          <!-- {{showPrice}} -->
        </p>
        <!-- <p class="row" v-if="discount >0">
          <span class="row_item">优惠</span> -
          <span class="row_item1">¥</span>
          {{discount}}
        </p>-->
      </div>
      <!-- 抢购商品禁用优惠券 -->
      <div class="ticket"
           @click="toTicketDetail"
           v-if="mall.activity_status!==2 && ticket_array.length>0">
        <span class="tic_img">券</span>
        <span v-if="type_name==''">{{ticket_array.length}}张可使用</span>
        <span v-if="type_name!==''">{{type_name}}</span>
        <img src="https://h5.ameimeika.com/mp_images/jifenshangcheng/xiangqingye/xiayibu@2x.png"
             alt
             class="right" />
      </div>
      <!-- 无优惠券可用 -->
      <div class="ticket"
           v-if="mall.activity_status!==2 && ticket_array.length == 0">
        <span class="tic_img tic_img1">券</span> 无优惠券可用
      </div>
      <!-- 可优惠价格展示 -->
      <div class="text2 text6"
           v-if="discount !== ''">
        <p class="row">
          <span class="row_item">优惠</span>
          <span class="row_item1"
                :class="discount>0?'row_item3':'row_item2'">¥</span>
          <span :class="discount>0?'row_item3':'row_item2'">{{discount}}</span>
        </p>
      </div>
      <p class="tips">※未满18周岁的手术人需在监护人陪同下到院面诊</p>
      <!-- plus -->
      <div class="plus clearfix">
        <div class="tip">PLUS会员优惠</div>
        <div class="num"
             v-if="mall.is_plus==1">-￥{{plus_price||0}}</div>
        <div class="open"
             v-if="mall.is_plus!=1"
             @tap.stop="to_plus()">
          立即开通
          <img :src="imgUrl+'mp_3.0/返回@2x.png'"
               v-if="imgUrl"
               alt
               class="icon" />
        </div>
      </div>

      <div class="toastprice"></div>
    </scroll-view>
    <div class="divbottom">
      <div class="total">
        合计：
        <span class="num1">¥</span>
        <span class="num">{{totalCost}}</span>
      </div>
      <div class="rightbox">
        <button class="btn"
                @click="submitBooking"
                :disabled="isDisabled"
                v-text="project_type==1?'提交订单':'立即预约'"></button>
      </div>
    </div>
  </div>
</template>
<script>
import doctorList from "@/components/doctorList/doctorList";
import common from "@/assets/js/mmk_common.js";
import pay from "@/assets/js/pay1.js";
import imageurl from "@/assets/js/image.js";
imageurl;
export default {
  data () {
    return {
      imgUrl: common.image_response,
      ImgBaseUrl: common.image_resource,
      date: "请选择预约时间",
      style: true,
      ishow: false,
      mall: [],
      ticket_array: [],
      //   保存原始优惠券
      ticket_list: [],
      ticket_id: 0, //优惠券id,
      ticket_data: {},
      telNum: "",
      totalCost: 0,
      order_sn: "",
      mallID: "",
      start: "",
      currentdate: "",
      isDisabled: false,
      referee_realname: "",
      discount: "", //优惠券满减金额
      ticket_name: "",
      isPhone: true,
      wetchartNum: "", //微信号
      ticket_mark: false, //优惠券弹窗标识
      collected: true, //优惠券是否领取
      appointment_price: 0,
      end_time: "",
      type: "", //项目提交的类型
      type_name: "",
      kou_credit: 0, //积分抵扣
      deduction_credit: 0,
      user_credit: 0, //用户的可用积分（计算）
      all_price: 0,
      doctorList: "",
      activity_status: "",
      showPrice: "", //总价，展示不计算
      real_kou: 0,
      user_credit_mask: "", //弹窗显示
      text_mask: "",
      project_type: "",
      endtime: 0,
      start_year: new Date().getFullYear() - 0,
      start_month: new Date().getMonth() - 0 + 1,
      start_date: new Date().getDate() - 0,
      dikou_point: 0.0,//抵扣积分后的金额,
      plus_price: null,
    };
  },
  onLoad (options) {
    Object.assign(this.$data, this.$options.data());
    this.style = true;
    //项目详情传过来的商品id
    this.mallID = options.str;
    this.discount = "";
    this.ticket_mark = false;
    this.currentdate = "";
    this.end_time = "";
    this.endtime = 0;
    this.wetchartNum = "";
    if (options.tg == 1 || options.activity_project_status == 1) {
      //tg == 1 全款项目 ，activity_project_status == 1 抢购项目
      this.project_type = 1;
      wx.setStorageSync("confirm_title", "确认订单");
      wx.setNavigationBarTitle({
        title: wx.getStorageSync("confirm_title")
      });
    } else {
      this.project_type = 0;
      wx.setStorageSync("confirm_title", "确认预约");
      wx.setNavigationBarTitle({
        title: wx.getStorageSync("confirm_title")
      });
    }

    if (!wx.getStorageSync("user_data").referee_phone) {
      this.isPhone = false; //没有服务商号码
    } else {
      this.isPhone = true;
      this.telNum = wx.getStorageSync("user_data").referee_phone;
    }
    this.type_name = "";
    // this.getEndtime()
    this.getData();
    this.getInfoData();
  },
  onShow () {
    // this.telNum = "";
    this.date = "请选择预约时间";
    // this.getNowFormatDate();
    this.style = true;
    this.ticket_array = [];
    this.ticket_id = 0;
    this.discount = 0;
    this.currentIndex = "";
    this.type_name = "";
    this.ticket_mark = false;
    this.currentdate = "";
    this.end_time = "";
    this.endtime = 0;
    this.wetchartNum = "";
    if (!wx.getStorageSync("user_data").referee_phone) {
      this.isPhone = false; //没有服务商号码
      this.telNum = "";
    } else {
      this.isPhone = true;
      this.telNum = wx.getStorageSync("user_data").referee_phone;
    }
    this.getData();
    this.getInfoData();
    // this.getEndtime()
  },
  components: {
    doctorList
  },
  watch: {
    kou_credit (newVal) {
      // 抵扣积分发生改变
      if (this.kou_credit >= this.real_kou) {
        this.kou_credit = this.real_kou;
      }
      //   计算抵扣后的金额
      this.dikou_point = (this.all_price * 100 - newVal * 100) / 100;
      // 如果已经选中了优惠券   判断选中的优惠券的可使用价格是否低于当前的总价  低于就清空
      if (this.ticket_id != "") {
        let ticket_selected = {};
        this.ticket_array.forEach(val => {
          if (this.ticket_id == val.id) {
            ticket_selected = val;
          }
        });
        // 如果抵扣后金额小于优惠券的金额
        if (this.dikou_point < ticket_selected.type_money || this.totalCost < 1) {
          this.type_name = "";
          this.ticket_id = "";
          this.discount = 0;
          this.totalCost = parseFloat(
            (this.all_price * 100 -
              this.discount * 100 -
              this.kou_credit * 100 -
              this.plus_price * 100) /
            100
          )
        }
      }
      this.ticket_array = this.ticket_list.filter(val => {
        return val.type_money < this.dikou_point;
      });
      this.cacul_plus()
      this.$forceUpdate();
    },
    plus_price (newVal) {
      this.totalCost = (
        (this.all_price * 100 - this.discount * 100 - this.kou_credit * 100 - this.plus_price * 100) /
        100
      )
      console.log(this.plus_price);
      console.log('plus_price===' + this.totalCost);

    },
    ticket_id (newVal) {
      this.totalCost = (
        (this.all_price * 100 - this.discount * 100 - this.kou_credit * 100 - this.plus_price * 100) /
        100
      )
      if (this.ticket_data.source == 3) {
        this.kou_credit = 0
        this.totalCost = 0
      }
      console.log('ticket_id===' + this.totalCost);
    },
    totalCost (newVal) {
      this.totalCost = newVal - 0 < 0 ? '0.0' : this.totalCost;
    }
  },
  mounted () { },
  methods: {
    //商品信息
    getData () {
      //预约项目
      common.mmk_Loading(0);
      common.fly_post(
        "api/v4_2/project/affirm",
        {
          id: this.mallID,
          user_id: wx.getStorageSync("user_id")
        },
        msg => {
          common.mmk_Loading(1);
          let res = msg.data;
          if (res.status_code == 0) {
            this.mall = res.data;
            this.doctorList = res.data.project_doctors;
            this.activity_status = res.data.activity_status; //项目种类
            console.log('activity_status' + this.activity_status);
            this.deduction_credit = res.data.deduction_credit || 0;
            this.cacul_plus()
            if (res.data.deduction_credit > res.data.user_credit) {
              this.real_kou = res.data.user_credit;
              // this.real_kou = 500
            } else {
              this.real_kou = res.data.deduction_credit;
              // this.real_kou = 500
            }
            if (this.activity_status == 4) {
              this.showPrice = res.data.project_price;
              this.user_credit = res.data.user_credit;
              // this.user_credit =500;
              this.all_price = res.data.project_price;
              setTimeout(() => {
                this.point_init();
              }, 500);
            } else {
              this.all_price = res.data.appointment_price;
              this.appointment_price = res.data.appointment_price;
              this.showPrice = res.data.appointment_price;
            }
            // this.kou_credit = res.data.deduction_credit;
            if (res.data.ticket) {
              // this.isTicket = true;
              this.ticket_list = res.data.ticket;
              this.ticket_list.forEach(element => {
                element.end = new Date(element.send_end_time * 1000).Format(
                  "yyyy.MM.dd"
                );
                element.start = new Date(element.send_start_time * 1000).Format(
                  "yyyy.MM.dd"
                );
                element.is_use = 1;
              });
              this.ticket_array = [...this.ticket_list];
            }

            this.endtime = res.data.last_time;
            this.getEndtime();
          } else {
            common.mmk_Loading(2, res.message);
            return false;
          }
        }
      );
    },
    getInfoData () {
      common.mmk_Loading(0);
      setTimeout(() => {
        common.fly_post("api/v4_2/my_info_detail", "", result => {
          let res = result.data;
          common.mmk_Loading(1);
          if (res.status_code == 0) {
            this.telNum = res.data.referee_phone;
            wx.setStorageSync("user_data", res.data);
          } else {
            common.mmk_Loading(2, res.message);
          }
        });
      }, 200);
    },
    // 计算plus会员
    cacul_plus () {
      // (项目价格 - 积分 - 优惠券) * plus优惠比例
      this.plus_price = (Math.round(((((this.activity_status == 4 ? this.mall.project_price : this.mall.appointment_price) * 100 - this.kou_credit * 100 - this.discount * 100) * (this.mall.plus_ratio)) / 100) * 100)) / 100
      console.log(this.plus_price);
    },

    // 日期选择器
    bindDateChange: function (e) {
      this.style = false;
      this.date = e.target.value;
    },
    // 打电话按钮
    call () {
      wx.makePhoneCall({
        phoneNumber: "4006711314"
      });
    },
    focusInput () {
      let re = /^[1][2,3,4,5,6,7,8][0-9]{9}$/;
      if (!re.test(this.telNum)) {
        wx.showToast({
          title: "请输入正确的手机号",
          icon: "none",
          duration: 2000,
          mask: true
        });
      } else {
        return false;
      }
    },
    //提交订单
    submitBooking () {
      let that = this;
      if (!wx.getStorageSync("user_token")) {
        wx.navigateTo({ url: "/pages/package_main/login/main" });
      }
      if (
        that.style &&
        this.mall.activity_status !== 2 &&
        this.mall.activity_status !== 4
      ) {
        common.mmk_Loading(2, "请填写预约日期");
        return false;
      }
      common.mmk_Loading(1);
      if (parseFloat(this.totalCost) <= 0) {
        that.conmit("1");
      } else {
        if (that.activity_status == 4 && this.kou_credit > 0) {
          //积分抵扣项目
          if (this.user_credit_mask > 0) {
            this.text_mask =
              "积分（含可提现积分" + this.user_credit_mask + "）";
          } else {
            this.text_mask = "";
          }
          wx.showModal({
            title: "",
            content:
              "本次消费将消耗" +
              this.kou_credit +
              this.text_mask +
              "，是否继续",
            showCancel: true,
            cancelText: "取消",
            cancelColor: "#666",
            confirmText: "继续",
            confirmColor: "#FF383E",
            success: res => {
              if (res.confirm) {
                that.conmit("2");
              } else if (res.cancel) {
              }
            }
          });
        } else {
          this.conmit("2");
        }
      }
    },
    conmit (num) {
      if (this.telNum == null) {
        this.telNum = "";
      }
      let obj, api;
      api = "api/v4_2/project_order/submit";
      obj = {
        project_id: this.mallID,
        service_phone: this.telNum,
        credit: this.kou_credit,
        hospital_id: this.mall.hospital_id,
        wechat: this.wetchartNum,
        ticket_id: this.ticket_id
      };
      if (this.activity_status == 4) {
        //走订单
        //全款
        this.type = 6;
        api = "/api/v4_2/project/order";
        this.date = "";
      } else if (this.activity_status == 2) {
        //走订单
        //抢购中
        this.type = 5;
        this.kou_credit = 0;
        this.date = "";
        api = "/api/v4_2/project/order";
      } else {
        this.type = 3;
        this.kou_credit = 0;
        obj = {
          project_id: this.mallID,
          appointment_time: this.date,
          service_phone: this.telNum,
          ticket_id: this.ticket_id,
          wechat: this.wetchartNum,
          type: this.type,
          credit: this.kou_credit,
          hospital_id: this.mall.hospital_id
        };
      }
      common.mmk_Loading(0);
      common.fly_post(api, obj, msg => {
        common.mmk_Loading(1);
        let res = msg.data;
        if (res.status_code == 0) {
          this.order_sn = res.data.order_sn;
          if (num == 1) {
            //支付金额为0 （积分抵扣后为0 、普通项目用了优惠券后为0）
            if (this.activity_status == 2 || this.activity_status == 4) {
              //全款项目和抢购项目
              wx.redirectTo({ url: "/pages/package_mine/project_order_list/main" });
            } else {
              //普通项目支付
              wx.redirectTo({ url: "/pages/package_projects/booking_success/main" });
            }
          } else if (num == 2) {
            if (this.activity_status == 2 || this.activity_status == 4) {
              //全款项目和抢购项目支付
              pay(
                res.data.body_title,
                this.order_sn,
                res.data.order_price,
                "project_full_order"
              );
            } else {
              //普通项目支付
              pay(
                res.data.body_title,
                this.order_sn,
                res.data.order_price,
                "project"
              );
            }
          }
        } else if (res.status_code == 2188) {
          wx.showModal({
            title: "提示",
            content: "活动已结束，请重新进行预约",
            showCancel: false,
            confirmText: "确定",
            confirmColor: "#FF383E",
            success: function (res) {
              if (res.confirm) {
                wx.redirectTo({
                  url: "/pages/package_projects/project_detail/main?id=" + this.mallID
                });
              }
            }
          });
        } else if (res.status_code == 2191) {
          wx.showModal({
            title: "",
            content: "项目正在抢购，请重新进行预约",
            showCancel: false,
            confirmText: "确定",
            confirmColor: "#FF383E",
            success: function (res) {
              if (res.confirm) {
                wx.redirectTo({
                  url: "/pages/package_projects/project_detail/main?id=" + this.mallID
                });
              }
            }
          });
        } else if (res.status_code == 2214) {
          wx.showModal({
            title: "",
            content: res.message,
            showCancel: false,
            confirmText: "我知道了",
            confirmColor: "#FF383E",
            success: function (res) {
              if (res.confirm) {
                // wx.redirectTo({ url: '/pages/project_detail/main?id=' + this.mallID });
              }
            }
          });
        } else if (res.status_code == 1027) {
          //未进行一级认证
          common.mmk_Loading(2, res.message);
          // wx.navigateTo({ url: "/pages/identification/main?status=1" });
        } else {
          common.mmk_Loading(2, res.message);
          return false;
        }
      });
    },
    // 点击优惠券
    toTicketDetail () {
      this.ticket_mark = true;
    },
    // 关闭优惠券
    closeTicketBox () {
      this.ticket_mark = false;
    },
    // 使用优惠券
    checkTicket (item) {
      this.ticket_array.forEach(element => {
        element.is_use = 1;
      });
      item.is_use = 2;
      this.type_name = item.type_name;
      this.ticket_id = item.id;
      this.ticket_data = item
      if (item.dedicated_status == 1) {
        //是否为免费预约券
        this.discount = this.appointment_price;
      } else {
        this.discount = item.type_money;
      }
      if (this.activity_status == 4) {
        //积分抵扣项目
        let jisuan_jifen = (
          (this.all_price * 100 - this.discount * 100) / 100
        );
        //使用优惠券后的价格
        // this.kou_credit = parseFloat(this.real_kou * 100 / 100);
        if (
          (jisuan_jifen - this.real_kou < 0 && jisuan_jifen > 1) ||
          (jisuan_jifen - this.real_kou < 0 && jisuan_jifen <= 0)
        ) {
          if (
            ((this.all_price * 100 - this.discount * 100) / 100) > 0
          ) {
            this.getOrderPoint();
          }
        }
        if (jisuan_jifen - this.real_kou > 0) {
          //积分全部用
          let can_use;
          if (jisuan_jifen > this.real_kou) {
            can_use = this.real_kou;
          } else {
            can_use = jisuan_jifen;
          }
          this.real_kou = can_use;
          this.dikou_point =
            (this.all_price * 100 - this.kou_credit * 100) / 100;
          this.getOrderPoint();
        }
        //使用完优惠券价格0~1不能使用积分抵扣
        if (jisuan_jifen < 1 && jisuan_jifen > 0) {
        }

        //总价-优惠券-抵扣积分之后小于0
      } else {
        // 预约项目
        if (
          (this.appointment_price * 100 - this.discount * 100) / 100 <
          0
        ) {
          this.totalCost = (0).toFixed(2);
        } else {
          //   this.totalCost = (
          //     (this.appointment_price * 100 - this.discount * 100) /
          //     100
          //   );
        }
      }
      this.ticket_mark = false;
      this.cacul_plus()
    },
    // 积分加减
    creadite_fix (e) {
      switch (e) {
        case 1:
          if (this.kou_credit < this.real_kou) {
            this.kou_credit++;
          }
          break;
        case 0:
          if (this.kou_credit > 0) {
            this.kou_credit--;
          }
          break;

        default:
          break;
      }
      // this.dikou_point = (this.all_price * 100 - this.kou_credit * 100) / 100;
    },
    credite_input () {
      //积分输入
      let jisuan_jifen = this.all_price;
      let can_use;
      //   if (jisuan_jifen > this.real_kou) {
      //     can_use = this.real_kou;
      //   } else {
      //     can_use = jisuan_jifen;
      //   }
      can_use = jisuan_jifen;

      if (this.kou_credit >= can_use) {
        this.kou_credit = parseInt(can_use);
        // this.dikou_point = (this.all_price * 100 - this.kou_credit * 100) / 100;
        this.getOrderPoint();
      }
      //输入积分大于0且小于最大可使用时显示输入积分，正则去除数字前面的0
      if (can_use - this.kou_credit > 0 && this.kou_credit > 0) {
        this.kou_credit = (this.kou_credit + "").replace(/\b(0+)/gi, "");
        // this.dikou_point = (this.all_price * 100 - this.kou_credit * 100) / 100;
        this.getOrderPoint();
      }
      //输入积分小于0或者为空时显示为0
      if (this.kou_credit - 0 <= 0 || this.kou_credit == "") {
        this.kou_credit = 0;
        this.dikou_point = (this.all_price * 100 - this.kou_credit * 100) / 100;
      }
    },
    point_init () {
      //进页面计算输入框的积分显示
      if (this.mall.plus_price > 0) {
        this.all_price =
          (this.mall.project_price * 100 - (this.mall.plus_price || 0) * 100) /
          100;
      }
      //   判断用户的积分是否大于可抵扣积分
      if (this.user_credit < this.deduction_credit) {
        this.kou_credit = this.user_credit;
        this.dikou_point = (this.all_price * 100 - this.kou_credit * 100) / 100;
        this.ticket_array = this.ticket_array.filter(val => {
          return val.type_money < this.dikou_point;
        });
        this.getOrderPoint();
      } else {
        // this.kou_credit = (this.user_credit * 100 - this.mall.plus_price * 100) / 100;
        this.kou_credit = parseInt(
          this.all_price > this.deduction_credit
            ? this.deduction_credit
            : this.all_price
        );
        this.dikou_point = (this.all_price * 100 - this.kou_credit * 100) / 100;
        this.ticket_array = this.ticket_array.filter(val => {
          return val.type_money < this.dikou_point;
        });
        this.getOrderPoint();
      }
    },
    scroll () { },
    scrollmain () { },
    doctorDetail () {
      this.$refs.mychild.toDetail();
    },
    clearEmoji () {
      // 禁止输入表情
      this.wetchartNum = this.wetchartNum.replace(
        /\uD83C[\uDF00-\uDFFF]|\uD83D[\uDC00-\uDE4F]/g,
        ""
      );
      //禁止输入中文
      this.wetchartNum = this.wetchartNum.replace(
        /[\u4E00-\u9FA5]|[\uFE30-\uFFA0]/g,
        ""
      );
    },
    //订单消费积分计算
    getOrderPoint () {
      common.mmk_Loading(0);
      common.fly_post(
        "api/v4_2/order/order_submit",
        {
          order_credit: this.kou_credit
        },
        result => {
          common.mmk_Loading(1);
          let res = result.data;
          if (res.status_code == 0) {
            this.user_credit_mask = res.data.user_credit;
          } else {
            // common.mmk_Loading(2,res.message);
          }
        }
      );
    },
    getEndtime () {
      let y = this.start_year; //当前年
      let m = this.start_month; //月
      let d = this.start_date; //日
      this.currentdate = y + "-" + m + "-" + d;
      if (this.endtime != "0") {
        this.end_time = new Date(this.endtime * 1000).Format("yyyy-MM-dd");
      } else {
        if (m < 12) {
          m = m + 1;
        }
        if (this.start_month == 12) {
          m = 1;
          y = this.start_year + 1;
        }
        // 判断日期
        if (m !== 2) {
          if ((m == 4 || m == 6 || m == 9 || m == 11) && d > 30) {
            d = 30;
          }
        } else {
          //判断是否是闰年
          if (((y % 4 == 0 && y % 100 != 0) || y % 400 == 0) && d > 29) {
            d = 29;
          } else if (d > 28) {
            d = 28;
          }
        }
        this.end_time = y + "-" + m + "-" + d;
      }
    },
    // 跳转PLUS
    to_plus () {
      wx.switchTab({ url: '/pages/plus/main' });
    }
  }
};
</script>
<style scoped lang="less">
.container {
  width: 100%;
  height: 100%;
  background-color: #f3f4f6;
  position: relative;
}
.mask {
  width: 100%;
  height: 100%;
  position: fixed;
  background: rgba(0, 0, 0, 0.47);
  z-index: 999;
  .ticketBox {
    width: 100%;
    height: auto;
    box-sizing: border-box;
    background-color: #fff;
    position: absolute;
    bottom: 0px;
    left: 0;
    border-radius: 5px;
    padding: 0 8px 10px 10px;
    .tb-title {
      height: 44px;
      font-weight: 600;
      font-size: 14px;
      color: #333;
      line-height: 44px;
      text-align: center;
      position: relative;
      margin: 0 5px 10px;
      &::before {
        content: "";
        width: 98%;
        height: 0.5px;
        background-color: #e0e0e0;
        position: absolute;
        bottom: 0.5%;
        left: 0.5%;
      }
      .close {
        width: 40px;
        height: 44px;
        font-size: 30px;
        color: #666;
        position: absolute;
        right: 0;
      }
    }
    .tb-ticket {
      display: flex;
      height: 92px;
      margin: 10px 0;
      background-color: #fff;
      border-radius: 10px;
      box-shadow: 0px 2px 8px 0px rgba(164, 178, 193, 0.45);
      overflow: hidden;
      position: relative;
      .tb-left {
        width: 98px;
        height: 100%;
        border-right: 1px dashed rgba(235, 235, 235, 1);
        position: relative;
        .center {
          width: 100%;
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          .money {
            text-align: center;
            .icon {
              font-size: 12px;
              font-family: "STHeitiTC-Medium", "STHeitiTC";
              font-weight: 500;
              color: rgba(220, 47, 107, 1);
              display: inline-block;
              vertical-align: bottom;
            }
            .num {
              font-size: 26px;
              font-family: "STHeitiTC-Medium", "STHeitiTC";
              font-weight: 500;
              color: rgba(220, 47, 107, 1);
              line-height: 24px;
              display: inline-block;
              vertical-align: bottom;
            }
          }
          .tip {
            font-size: 12px;
            font-family: "PingFangSC-Regular", "PingFang SC";
            font-weight: 400;
            color: rgba(235, 118, 158, 1);
            line-height: 17px;
            text-align: center;
            margin-top: 6px;
          }
          &.special {
            font-size: 18px;
            font-family: "PingFangSC-Semibold", "PingFang SC";
            font-weight: 600;
            color: rgba(220, 47, 107, 1);
            line-height: 24px;
            text-align: center;
          }
        }

        &::before {
          content: "";
          width: 10px;
          height: 10px;
          border-radius: 50%;
          display: block;
          background-color: #fff;
          box-shadow: 0px 2px 8px 0px inset rgba(164, 178, 193, 0.45);
          position: absolute;
          top: 0;
          right: 0;
          transform: translate(50%, -50%);
        }
        &::after {
          content: "";
          width: 10px;
          height: 10px;
          border-radius: 50%;
          display: block;
          background-color: #fff;
          box-shadow: 0px 2px 8px 0px inset rgba(164, 178, 193, 0.45);
          position: absolute;
          bottom: 0;
          right: 0;
          transform: translate(50%, 50%);
        }
      }
      .tb-right {
        flex: 1;
        padding: 10px;
        box-sizing: border-box;
        position: relative;
        .t-title {
          font-size: 16px;
          font-family: "PingFangSC-Medium", "PingFang SC";
          font-weight: 500;
          line-height: 20px;
          display: flex;
          .t-type {
            color: rgba(254, 120, 158, 1);
            vertical-align: middle;
            display: inline-block;
          }
          .t-name {
            color: rgba(29, 32, 35, 1);
            vertical-align: middle;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 1;
            -webkit-box-orient: vertical;
            flex: 1;
          }
        }
        .dec {
          font-size: 12px;
          font-family: "PingFangSC-Regular", "PingFang SC";
          font-weight: 400;
          color: rgba(63, 69, 75, 1);
          line-height: 16px;
          margin-top: 5px;
        }
        .t-timer {
          font-size: 12px;
          font-family: "PingFangSC-Regular", "PingFang SC";
          font-weight: 400;
          color: rgba(96, 105, 114, 1);
          line-height: 16px;
          position: absolute;
          left: 10px;
          bottom: 10px;
        }
      }
      .user-btn {
        width: 24px;
        height: 24px;
        position: absolute;
        bottom: 5px;
        right: 7px;
        .img {
          width: 100%;
          height: 100%;
        }
      }
    }
  }
}
.mall {
  box-sizing: border-box;
  padding: 10px 15px;
  border-radius: 8px;
  display: flex;
  position: relative;
  background-color: #fff;
  &::before {
    content: "";
    width: 100%;
    height: 0.5px;
    background-color: #d8d8d8;
    position: absolute;
    top: 0;
    left: 0;
  }
}
.mall_left {
  margin-right: 10px;
}
.mallIMG {
  width: 90px;
  height: 90px;
}

.mall_name {
  height: auto;
  font-size: 14px;
  font-weight: 600;
  color: #444;
  // margin-bottom: 5px;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}
.hos_name {
  font-size: 12px;
  color: #999;
  // margin-bottom: 5px;
}
.plusbox {
  width: auto;
  height: 16px;
  background: url("https://mmkapp.oss-cn-beijing.aliyuncs.com/h5_images/lifebeauty/3/titlebg.png")
    no-repeat;
  background-size: 100% 100%;
  line-height: 16px;
  color: #fff;
  text-align: center;
  padding: 1px 7px;
  margin-top: 3px;
  font-size: 10px;
  display: inline-block;
}
.booking_price {
  position: absolute;
  // bottom: 10px;
  font-size: 12px;
  color: #ff383e;
  .item {
    font-size: 10px;
  }
  .text1 {
    font-size: 10px;
  }
}
.price {
  font-size: 16px;
}
.main {
  margin: 10px 0;
}
.picker,
.text,
.ticket_list {
  width: 100%;
  height: 44px;
  box-sizing: border-box;
  line-height: 44px;
  padding: 0 15px;
  font-size: 14px;
  position: relative;
  display: flex;
  color: #666;
  background-color: #fff;
}
.text::before {
  content: "";
  height: 0.5px;
  width: 100%;
  background-color: #f3f4f6;
  position: absolute;
  top: 0;
  left: 0;
}

.text4 {
  font-size: 12px;
  color: #666;
  padding-left: 15px;
  margin-bottom: 10px;
  .item {
    font-size: 14px;
    color: #ff7100;
  }
}
.text5 {
  height: 44px;
  color: #333;
  font-size: 14px;
  // margin-bottom: 10px;
  position: relative;
  .red {
    color: #ff383e;
  }
  .chhoose_use_sel {
    text-align: center;
    width: 28%;
    position: absolute;
    right: 1.5%;
    top: 25%;
    line-height: 20px;
    .num_less,
    .num_add {
      border: solid 1px #cccccc;
      display: inline-block;
      width: 20px;
      height: 20px;
    }
    .num_self {
      border: solid 1px #cccccc;
      display: inline-block;
      width: 44px;
      height: 12px;
      min-height: 20px;
      vertical-align: top;
      line-height: 12px;
    }
  }
}
.date_unde {
  color: #999;
  position: absolute;
  left: 40%;
}
.date_value {
  color: #999;
  position: absolute;
  left: 30%;
  top: 0;
}
.right_icon {
  width: 30px;
  height: 30px;
  position: absolute;
  right: 0;
}
.tel_input {
  width: 70%;
  display: inline-block;
  height: 44px;
  line-height: 44px;
  margin-right: 5px;
  position: absolute;
  left: 30%;
  top: 0;
  color: #999;
}
.service_tel {
  font-size: 14px;
  color: #999;
  position: absolute;
  left: 30%;
  top: 1%;
}
.right {
  width: 24px;
  height: 24px;
  position: absolute;
  right: 1.5%;
  top: 20%;
}
.ticket {
  height: 40px;
  box-sizing: border-box;
  line-height: 44px;
  position: relative;
  padding-left: 45px;
  font-size: 14px;
  color: #333;
  background-color: #fff;
  margin-top: 10px;
}
.tic_img {
  width: 22px;
  height: 22px;
  background-color: #fe6a9c;
  color: #fff;
  border-radius: 3px;
  line-height: 22px;
  position: absolute;
  top: 26%;
  left: 4%;
  text-align: center;
}
.tic_img1 {
  background-color: #d8d8d7;
}
.divbottom {
  width: 100%;
  height: 45px;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #fff;
  box-shadow: 0px -2px 8px 0px rgba(0, 0, 0, 0.07);
  display: flex;
  // z-index: 999;
  .total {
    width: 70%;
    height: 45px;
    line-height: 45px;
    font-size: 12px;
    color: #666;
    text-align: right;
    display: inline-block;
    .num {
      font-size: 17px;
      height: 45px;
      color: #ff383e;
      display: inline-block;
    }
    .num1 {
      font-size: 10px;
      height: 45px;
      color: #ff383e;
      display: inline-block;
      margin-right: 4px;
    }
  }
  .rightbox {
    width: 28%;
    height: 45px;
    display: inline-block;
    .btn {
      width: 88px;
      height: 39px;
      border-radius: 19.5px;
      background: #ff383e;
      color: #fff;
      font-size: 12px;
      line-height: 39px;
      display: inline-block;
      margin: 3px 15px 0px 12px;
      &.btn::after {
        border: none;
      }
    }
  }
}

.text2 {
  height: auto;
  background-color: #fff;
}
.text6 {
  height: 40px;
}
.toastprice {
  width: 100%;
  height: 100px;
  background-color: #f3f4f6;
}
.row {
  height: 32px;
  line-height: 32px;
  box-sizing: border-box;
  padding: 0 15px;
  font-size: 16px;
  color: #ff383e;
  text-align: right;
  position: relative;
}
.row_item {
  position: absolute;
  left: 3.5%;
  top: 0;
  font-size: 12px;
  color: #333;
}
.point {
  font-size: 16px;
  color: #ff7100;
}
.row_item1 {
  font-size: 12px;
}
.row_item2 {
  color: #949494;
}
.row_item3 {
  color: #ff383e;
}
.tips {
  //   width:309px;
  // height:20px;
  font-size: 14px;
  color: rgba(102, 102, 102, 1);
  line-height: 14px;
  padding: 14px 0 0 15px;
}
.plus {
  margin: 10px 0;
  padding: 0 15px;
  background-color: #fff;
  .tip {
    font-size: 12px;
    font-family: "PingFangSC-Medium", "PingFang SC";
    font-weight: 500;
    color: rgba(51, 51, 51, 1);
    line-height: 37px;
    float: left;
  }

  .num {
    font-size: 16px;
    font-family: "STHeitiTC-Medium", "STHeitiTC";
    font-weight: 500;
    color: rgba(255, 56, 62, 1);
    line-height: 37px;
    float: right;
  }
  .open {
    float: right;
    font-size: 12px;
    font-family: "PingFangSC-Regular", "PingFang SC";
    font-weight: 400;
    color: rgba(236, 88, 139, 1);
    line-height: 37px;
    .icon {
      width: 6px;
      height: 12px;
      display: inline-block;
      vertical-align: middle;
      margin-left: 5px;
      line-height: 37px;
    }
  }
}
</style>


